<template>
  <div class="full home-shadow rd-12px p16px flex flex-col bg-#fff">
    <div class="w-full h40px home-title">待办事项</div>
    <div class="flex w-full flex-nowrap h20px">
      <div class="px12px relative c-#7636F5 font-bold">
        <span class="text-14px font-900!">待办</span>
        <div v-if="list.length > 0" class="absolute left-80% top--20% bg-#f00 rd-9999px px4px c-#fff text-10px cursor-pointer">
          {{ list.length }}
        </div>
        <div class="w100% h2px bg-#7636F5 absolute left-0 bottom-0"></div>
      </div>
    </div>
    <div class="flex-1 py10px overflow-auto">
      <div v-for="(item, index) in list" :key="index" class="flex flex-justify-between pr30px cursor-pointer py12px" @click="goBacklog()">
        <div>
          <div class="text-14px font-bold">{{ item.user?.displayName }}发起的“{{}}”</div>
          <div class="text-11px c-#7C8189 mt4px font-bold">时间&nbsp;{{ dayjs(item.createAt).format('MM-DD HH:mm') }}</div>
        </div>
        <div class="">
          <el-tag class="w46px! h20px! c-#E35D03! font-bold! bg-#FFE7CC! text-12px!" effect="light" type="warning">待审批</el-tag>
        </div>
      </div>
      <el-empty v-if="list.length <= 0" class="vab-data-empty" description="暂无数据" />
    </div>
  </div>
</template>

<script lang="ts" setup>
import dayjs from 'dayjs'
// import { getMySPProcessHomeApi } from '/@/api/home'
const router = useRouter()
const list = ref<any[]>([])

onMounted(() => {
  fetchData()
})

const pageLoading = ref<boolean>(false)
const fetchData = async () => {
  pageLoading.value = true
  // const { result } = await getMySPProcessHomeApi()
  // list.value = result
  pageLoading.value = false
}
const goBacklog = () => {
  router.push('/process/examined')
}
</script>

<style lang="scss" scoped>
:deep() {
  .el-empty {
    min-height: calc(100% - 60px);
    height: calc(100% - 60px);
    scale: 0.9;
    margin-top: 30px;
  }
}
</style>
